<div class="title-name">
	<h2>Tạo ứng dụng mới</h2>
</div>

<div class="alert alert-danger" role="alert">
    <ul>
        <li>Loi o day</li>
    </ul>
</div>

<form enctype="multipart/form-data" action="" method="post" id="add-new-app" class="form-horizontal">
	<div role="tabpanel">

		<!-- Nav tabs -->
		<ul id="tab-add-app" class="ifs-tabbar" role="tablist">
			<li role="presentation" class="active">
				<div class="ifs-tab-nav">
					<a href="#name-app" aria-controls="name-app" role="tab"
						data-toggle="tab">Khai báo tên</a>
				</div>
			</li>
			<li role="presentation">
				<div class="ifs-tab-nav">
					<a href="#type-app" aria-controls="type-app" role="tab"
						data-toggle="tab">Chọn loại ứng dụng</a>
				</div>
			</li>
			<li role="presentation">
				<div class="ifs-tab-nav">
					<a href="#file-app" aria-controls="file-app" role="tab"
						data-toggle="tab">Tải file lên</a>
				</div>
			</li>
			<li role="presentation">
				<div class="ifs-tab-nav">
					<a href="#info-app" aria-controls="info-app" role="tab"
						data-toggle="tab">Thông tin mô tả</a>
				</div>
			</li>
			<li role="presentation">
				<div class="ifs-tab-nav">
					<a href="#devices-app" aria-controls="devices-app" role="tab"
						data-toggle="tab">Chọn thiết bị</a>
				</div>
			</li>
			<li role="presentation">
				<div class="ifs-tab-nav">
					<a href="#contact-app" aria-controls="contact-app" role="tab"
						data-toggle="tab">Liên hệ</a>
				</div>
			</li>
		</ul>

		<!-- Tab panes -->
		<div class="tab-content">

			<div role="tabpanel" class="tab-pane active" data-index='1'
				id="name-app">
				<fieldset class="ifs_tab_cell">
					<legend>Bước 1: Khai báo tên ứng dụng</legend>
					<div class="tab-content-cell">
						<div class="form-group">
							<label for="name_app" class="col-xs-3 control-label">Tên ứng dụng</label>
							<div class="col-xs-5">
								<input type="text" class="form-control" id="name_app_new"
									name="name_app" placeholder="Tên ứng dụng">

							</div>
							<div class="col-xs-4">
								<p class="help-block-1">Tối đa 150 ký tự</p>
							</div>
						</div>
					</div>

				</fieldset>
			</div>
			<div role="tabpanel" class="tab-pane" id="type-app" data-index='2'>
				<fieldset class="ifs_tab_cell">
					<legend>Bước 2: Chọn loại ứng dụng</legend>
					<div class="tab-content-cell">
						<div class="radio">
							<label> <input type="radio" name="type_app" value="1"
								checked="checked"> Ứng dụng tải và sử dụng miễn phí
							</label>
							<div class="description">
								<p>Các ứng dụng không thu phí khi tải cũng như trong quá trình
									sử dụng trên hệ thống KidPlay. Người dùng có thể lên level,
									nâng cấp phiên bản,... mà không phải trả bất kỳ chi phí nào.
									Đây là loại ứng dụng giúp nhà phát triển đưa sản phẩm đến gần
									người tiêu dùng hơn.</p>
								<p>
									<b>Yêu cầu</b>
								</p>
								<ul>
									<li>Ứng dụng thuộc bản quyền của NPT</li>
									<li>Tải ứng dụng miễn phí</li>
									<li>Không thu phí người dùng bên trong ứng dụng</li>
									<li>Có thể gắn quảng cáo bên trong ứng dụng</li>
								</ul>
							</div>
						</div>
					</div>

				</fieldset>
			</div>
			<div role="tabpanel" class="tab-pane" id="file-app" data-index='3'>
				<fieldset class="ifs_tab_cell">
					<legend>Bước 3: Upload ứng dụng</legend>
					<div class="tab-content-cell">
						<div class="form-group">
							<label for="version_name" class="col-xs-3 control-label">Tên
								phiên bản (VD. 2.1.1)</label>
							<div class="col-xs-5">
								<input type="text" class="form-control" id="version_name_new" name="version_name"
									placeholder="Tên phiên bản">
								
							</div>
							<div class="col-xm-4">
							     <p class="help-block">Tối đa 30 ký tự</p>
							</div>
						</div>
						<div class="form-group">
							<label for="file-app" class="col-xs-3 control-label">Duyệt và tải
								file lên</label>
							<div class="col-xs-5">
								<input type="file" id="file_app_new" name="file_app">
								<p class="help-block">Loại tệp: *.ipa, *.apk, *jar, *cod, *jad, *.sis, *sisx.</p>
							</div>

						</div>
					</div>
				</fieldset>
			</div>
			<div role="tabpanel" class="tab-pane" id="info-app" data-index='4'>
				<fieldset class="ifs_tab_cell">
					<legend>Bước 4: Thông tin mô tả</legend>
					<div class="tab-content-cell">
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Icon ứng
								dụng</label>
							<div class="col-xs-5">
							<table style="width: 100%">
							     <tr>
							         <td>
							             <div class="fileUpload btn btn-primary btn-xs">
                                            <span>Tải lên</span>
                                            <input type="file" id="icon_app" class="upload" name="icon_app" >
                                        </div>
							         </td>
							         <td>
						                 <div style="text-align: center;margin-bottom: 8px;">
						                     <img id="icon_view" src="<?php echo TEMPLATE_URL?>/assets/images/no-icon.png" width="200" height="200" alt="your image" />
						                 </div>
							        </td>
							    </tr>
							</table>
								
							</div>
							<div class="col-xs-4">
								<b>Icon ứng dụng</b><br>
								<p class="help-block">
									<span>200 x 200</span><br> <span>32 bit PNG or JPG</span><br> <span>Lớn
										nhất 1024KB</span>
								</p>
							</div>
						</div>
						<div class="form-group">
							<label for="screenshot" class="col-xs-3 control-label">Ảnh
								screenshot<br> <span class="help-block-1">ít nhất 3</span>
							</label>
							<div class="col-xs-5">
								
    							<table style="width: 100%" id="table-screen">
    							     <tr>
    							         <td>
    							             <div class="fileUpload btn btn-primary btn-xs">
                                                <span>Tải lên</span>
                                                <input type="file" class="upload screenshot" name="screenshot[]" >
                                            </div>
    							         </td>
    							         <td class="viewimg">
    						                 
    							        </td>
    							    </tr>
    							   
    							</table>
    							
							</div>
							<div class="col-xs-4">
								<b>Ảnh screenshot</b>
								<p class="help-block">1136x640, 640x1136, 1024x768, 768x1024,
									960x640, 640x960, 480x800, 320x480, 320x240, 240x320 24 bit PNG
									or JPG</p>
							</div>

						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Video giới
								thiệu<br> <span class="help-block-1">Tùy chọn</span>
							</label>
							<div class="col-xs-5">
								<p class="help-block">Thêm đường dẩn tới video giới thiệu</p>
								<input type="text" class="form-control" name="video_app"
									placeholder="https://www.youtube.com/watch?v=ID">
							</div>
							<div class="col-xs-4">
								<b>Icon ứng dụng</b><br>
								<p class="help-block">
									<span>Nhập đường dẫn YouTube</span><br> <span>VD.
										https://www.youtube.com/watch?v=ID</span>
								</p>
							</div>
						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Tags</label>
							<div class="col-xs-5">
								<textarea class="form-control" rows="3" id="tags_new" name="tags"></textarea>
							</div>
							<div class="col-xs-4">
								<b>Tags</b><br>
								<p class="help-block">Mổi tag cách nhau bởi dấu ","</p>
							</div>
						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Mô tả ngắn</label>
							<div class="col-xs-9">
								<textarea class="form-control" rows="3" id="des_short_new" name="des_short"></textarea>
								<p class="help-block">Tối đa 200 ký tự</p>
							</div>

						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Mô tả</label>
							<div class="col-xs-9">
								<textarea class="form-control" rows="5" id="description_new" name="description"></textarea>
							</div>

						</div>
					</div>
				</fieldset>
			</div>
			<div role="tabpanel" class="tab-pane" id="devices-app" data-index='5'>
				<fieldset class="ifs_tab_cell">
					<legend>Bước 5: Chọn thiết bị</legend>
					<div class="tab-content-cell">
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Hệ điều hành</label>
							<div class="col-xs-5">
								<select class="form-control" id='os' name="os">
								</select>
								<div id="linh"></div>
							</div>

						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Phiên bản</label>
							<div class="col-xs-5">
								<select class="form-control" id='osv' name="osv">
									<option>---------------</option>
								</select>
							</div>

						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Thiết bị
								tương thích</label>
							<div class="col-xs-5">
								<select class="form-control" id='compatible' name='compatible'>
									<option>---------------</option>
								</select>
							</div>

						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Danh mục</label>
							<div class="col-xs-5">
								<select class="form-control" id='cat' name='cat'>
								</select>
							</div>

						</div>
					</div>
				</fieldset>
			</div>
			<div role="tabpanel" class="tab-pane" id="contact-app" data-index='6'>
				<fieldset class="ifs_tab_cell">
					<legend>Bước 6: Thông tin liên hệ và Xuất bản ứng dụng</legend>
					<div class="tab-content-cell">
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Website</label>
							<div class="col-xs-5">
								<input type="text" class="form-control" name="website_app"
									placeholder="Website">
							</div>

						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Email</label>
							<div class="col-xs-5">
								<input type="email" class="form-control" name="email_app"
									placeholder="Email">
							</div>

						</div>
						<div class="form-group">
							<label for="name-app" class="col-xs-3 control-label">Phone</label>
							<div class="col-xs-5">
								<input type="text" class="form-control" name="phone_app"
									placeholder="Phone">
							</div>

						</div>
					</div>
				</fieldset>
			</div>

		</div>
	</div>
	<div class="message">
		<!-- #messages is where the messages are placed inside -->
		<div class="form-group">
			<div class="col-sm-12">
				<div id="messages">122 1 21 212</div>
			</div>
		</div>
	</div>
	<div class="tab-footer">
		<div class="col-xs-6" style="padding-left: 0">
			<input class="btn btn-default" type="reset" id="cancle-app"
				value="Hủy bỏ"> <input class="btn btn-primary" type="submit"
				id="save-app" value="Lưu và Xuất bản">
		</div>
		<div class="col-xs-6" style="text-align: right; padding-right: 0;">
			<input class="btn btn-success" type="Button" id="prev-tab"
				value="Bước trước" style="display: none;"> <input
				class="btn btn-success" type="Button" id="next-tab"
				value="Bước tiếp theo">
		</div>

	</div>
</form>
